/**
* Created by ren on 2017/1/16.
*/
<template>
  <div class='dingtouXcList jSJDetail xcList'>
    <div class="container con-wrap">
      <div
        style="font-size: 18px;color: #fd8f23;margin-top: 12px;padding-left: 20px;border-bottom: 2px solid #e9e9e9;padding-bottom: 22px">
        {{jinshengjinData.kinsonName}}
      </div>
      <div class="dt-msg">
        <ul>
          <li>
            <div>年化收益率</div>
            <div class="weight">{{this.yield}}%</div>
          </li>
          <div class="line"><img src="../../assets/line.png" alt=""></div>
          <li>
            <div>期限</div>
            <div class="weight">
              {{jinshengjinData.validity}}
              <span v-if="jinshengjinData.unit==='day'">天</span>
              <span v-if="jinshengjinData.unit==='month'">月</span>
              <span v-if="jinshengjinData.unit==='year'">年</span>
              <span v-if="jinshengjinData.unit==='week'">周</span>
            </div>
          </li>
          <div class="line"><img src="../../assets/line.png" alt=""></div>
          <li>
            <div>起购克数</div>
            <div class="weight">{{parseFloat(jinshengjinData.weightMin/1000).toFixed(1)}}g起购</div>
          </li>
        </ul>
        <div style="float: left;width: 100%;margin-left: 21px;margin-top: 26px;">
          <img src="../../assets/risk.png"
               style="margin-right: 12px;width: 20px;margin-top: -3px;"><span>风险程度</span><span
          style="margin-left: 12px;color: #08e703">{{jinshengjinData.riskDegree}}</span> <span
          style="margin-left: 76px;margin-right: 14px">到期回款</span><span style="color: #fd8f23">自动转入平台零钱包</span>
        </div>
      </div>
      <div class="line"><img src="../../assets/line2.png" width="1"
                             height="240"></div>
      <div class="dt-form">
        <div>
          <label>剩余克数：</label>
          <span>不限</span>
        </div>
        <div>
          <label>起购克数</label>
          <select v-model="weight">
            <option v-bind:value="(item/1000).toFixed(1)" v-for="(item,index) in jinshengjinData.weightArry">
              {{(item/1000).toFixed(1)}}g
            </option>
          </select>
        </div>
        <div>
          <button class="btn" @click="toOrderConfirm">确定转存</button>
        </div>
      </div>
      <div class='product'>
        <div class="title"><i></i><span>金生金产品</span><i></i></div>
        <div v-html="jinshengjinData.introduce" style="padding: 20px"></div>
      </div>
    </div>
    <Notify :parentThis='this'></Notify>
  </div>
</template>

<script>
  import Datepicker from 'vuejs-datepicker'
  import UserServerAgreement from '../UserServerAgreement'
  import API from '../../api'
  import Notify from '../Notify'
  export default {
    name: 'dingtouXcList',
    components: {
      Datepicker,
      UserServerAgreement,
      Notify
    },
    props: ['_parentThis'],
    data: function () {
      return {
        date: new Date(2016, 9, 16),
        serverIsTrue: false,
        notifyStatus: 2,
        jinshengjinData: '',
        weight: '',
        GoldPrice: 0,
        yield: 0,
        countDown: 3
      }
    },
    methods: {
      agreed: function () {
        this.serverIsTrue = !this.serverIsTrue
      },
      findKinsonGoldList: function () {
        this.$http.post(API.findKinsonGoldList, {
          id: this._parentThis.zcjsjDetailId
        }).then((ret) => {
          const result = ret.body
          if (result.code === 1) {
            this.jinshengjinData = result.object.content[0]
            this.weight = (result.object.content[0].weightArry[0] / 1000).toFixed(1)
            this.yield = (result.object.content[0].yield * 100).toFixed(2)
            this.findGoldPrice(this.weight)
          } else {
            this.notifyStatus = '0|' + result.message
          }
        }, (err) => {
          console.log(err)
        })
      },
      findGoldPrice: function (weight) {
        weight = parseInt(weight)
        this.$http.post(API.findGoldPrice).then((ret) => {
          const result = ret.body
          if (result.code === 1) {
            this.GoldPrice = (weight * result.object / 100 * (this.yield / 100 - 0.02)).toFixed(2)
          } else {
            this.notifyStatus = '0|' + result.message
          }
        }, (err) => {
          console.log(err)
        })
      },
      toOrderConfirm: function () {
        this.$http.post(API.KinsonRenew, {
          kinsonId: this._parentThis.zcjsjDetailId,
          weight: this.weight * 1000,
          type: 1,
          userId: this.$cookie.get('id')
        }).then((ret) => {
          const result = ret.body
          if (result.code === 1) {
            this._parentThis.dtCutName = 'zcSuccess'
          } else {
            this.notifyStatus = '0|' + result.message
          }
        }, (err) => {
          console.log(err)
        })
      }
    },
    watch: {
      weight: function (newVal) {
        this.findGoldPrice(newVal)
      }
    },
    mounted: function () {
      this.findKinsonGoldList()
    }
  }
</script>